<template>
	<view class="container">
		<view class="title">
			出行方式
		</view>
		<view class="text">
			火车
		</view>
		<view class="title">
			起始站
		</view>
		<view class="text">
			武汉站
		</view>
		<view class="title">
			终点站
		</view>
		<view class="text">
			郑州东站吧
		</view>
		<view class="title">
			到站时间
		</view>
		<view class="text">
			2020-9-27 10:28:44
		</view>
		<view class="title">
			路线信息
		</view>
		<view class="box1">
			<view class="tit">
				打车
			</view>
			<view class="text">
				水电费拉拉拉手孔
			</view>
		</view>
		<view class="box1">
			<view class="tit">
				步行
			</view>
			<view class="text">
				<text>水电费拉拉阿萨德撒地方阿斯蒂芬水电费都是第三方 sad拉手孔</text>
				<view class="daohang">
					<image src="../../static/img/21.png" mode=""></image>
					<text>去导航</text>
				</view>
			</view>
		</view>
		<view class="box1">
			<view class="tit">
				地铁
			</view>
			<view class="text">
				水电费拉拉拉阿斯达四大撒大大实打实大的双方各大范甘迪规范统一手孔
			</view>
		</view>
		<view class="box1">
			<view class="tit">
				公交
			</view>
			<view class="text">
				水电费拉拉拉手孔阿斯达四大色翁蕊
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style lang="scss">
	page {
		background-color: #f6f7fb;
		
	}
	.container {
		padding: 0 30rpx 140rpx;
		border-top: 1px solid #f6f7fb;
		.title {
			font-size: 34rpx;
			color: #333;
			margin: 30rpx 0;
		}
		.text {
			padding: 20rpx;
			background-color: #fff;
			border-radius: 20rpx;
			color: #999;
			font-size: 28rpx;
		}
		.box1 {
			display: flex;
			margin: 20rpx 0;
			.tit {
				width: 100rpx;
				padding: 20rpx 0;
				font-size: 28rpx;
				color: #999;
				font-weight: 700;
			}
			.text {
				width: calc(100% - 100rpx);
		
				.daohang {
					display: flex;
					align-items: center;
					justify-content: flex-end;
					color: #9db1f9;
					font-size: 26rpx;
					image {
						width: 26rpx;
						height: 26rpx;
						margin-right: 10rpx;
					}
					
				}
					
			}
			
		}
			
	}
	
</style>
